<template>
  <el-dialog
    :title="title"
    :visible.sync="dialogFormVisible"
    :close-on-click-modal="false"
    custom-class="dialog-my"
  >
  <el-upload
          class="avatar-uploader"
          :action="baseUrl"
          :show-file-list="false"
          :on-success="handleAvatarSuccess"
          :headers="{token:token}"
        >
          <img v-if="picUrl" :src="picUrl" class="avatar" />
          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
        </el-upload>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submit">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { memberDailyCardPic } from '@/config/api'
import { times, divide } from '@/utils/tools'
import { uploadFile } from "@/config/interface";

export default {
  data () {


    return {
      dialogFormVisible: false,
      title: '上传用户图片',
      record: {},
      baseUrl: "",
      token:"",
      picUrl:""
    }
  },
  methods: {
   addShow (e) {
     this.baseUrl = uploadFile();
      this.token = this.$store.state.login.token;      
      this.record = e
      this.dialogFormVisible = true
     this.record = e
     this.picUrl = e.picUrl

    },

    submit () {
     memberDailyCardPic({id:this.record.id,picUrl:this.picUrl})
     this.$parent.getData()
      this.dialogFormVisible = false
    },
    handleAvatarSuccess (res, file) {
      this.picUrl = res.result;

    },
    setCard(type){
     let str = ""
     switch(type){
      case "0":
      str = "全天"
      break;
      case "1":
      str = "早"
      break;
      case "2":
      str = "中"
      break;
      case "3":
      str = "晚"
      break;
     }
     return str
    }

  }
}
</script>
<style>
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>